import React, { Component } from 'react'
import { Form, Input, Select, } from 'antd';

const { Option } = Select

export default class AddForm extends Component {

  myForm = React.createRef()
  UNSAFE_componentWillMount () {
    this.props.addform (this.myForm)
  }

  componentDidMount(){
    this.myForm.current.setFieldsValue({parentId:this.props.parentId})
  }
  
  render () {

    const { categoryList, parentId } = this.props

    return (
      <Form
      layout="vertical"
      name="form_in_modal"
      ref={this.myForm}
      initialValues={{parentId}}
    >
      <Form.Item
        name="parentId"
        >
        <Select>
          <Option value='0'>一级分类</Option>
          {
            categoryList.map (cItem => <Option value={cItem._id} key={cItem._id}>{cItem.name}</Option>)
          }
        </Select>
      </Form.Item>

      <Form.Item name="categoryName" 
        rules={[
          { 
            required: true,
            message: '分类名称必须输入' }
        ]}>
        <Input  placeholder='请输入分类名' />
      </Form.Item>
    </Form>
    )
  }
   

  
}
